.page-features {
  .layout-basic {
    padding-top: $spring-8points * 4;
    padding-bottom: $spring-8points * 6;
    max-width: 1200px;
    margin: 0 auto;
  }
  .page-title {
    padding: $spring-8points * 2 0 $spring-8points * 4;
    text-align: center;
    h1 {
      margin: 0;
      padding: 0;
      padding-bottom: $spring-8points * 2;
    }
    p {
      margin: 0;
      padding: 0;
    }
  }
  .colset {
    display: flex;
    .col {
      flex: 1;
      padding-left: $spring-8points * 10;
      &:first-child {
        padding-left: 0;
      }
    }
    article {
      padding: $spring-8points * 2 0;
      h2 {
        margin: 0;
        padding: 0;
        font-size: 18px;
        padding-bottom: $spring-8points;
      }
      p {
        padding: 0;
        margin: 0;
        color: #666;
      }
    }
  }

  .band {
    height: 680px;
    text-align: center;
    .band-background {
      background: $spring-gray-color;
      height: 400px;
      border-bottom: 1px solid darken($spring-gray-color, 5);
    }
    .text {
      padding: $spring-8points * 6 0;
      p {
        padding: 0;
        margin: 0 auto;
        &.title {
          font-size: 26px;
          letter-spacing: -1px;
        }
        &.description {
          color: #666;
          padding: $spring-8points * 2 0 0 0;
          max-width: 450px;
          font-size: 18px;
          strong {
            color: $spring-color;
            font-weight: normal;
          }
          a {
          }
        }
      }
    }
    .player {
      background: green;
      width: 800px;
      height: 450px;
      margin: 0 auto;
      box-shadow: 0 10px 30px 5px rgba(0, 0, 0, 0.15),
        inset 0 0 0 1px rgba(0, 0, 0, 0.1);
      border-radius: $spring-radius;
      overflow: hidden;
    }
  }
}
